import Vue from "vue"
import Vuex from 'vuex';
Vue.use(Vuex)

import aModule from './modules/a'
import bModule from './modules/b'

const store = {
    modules: {
        aModule,
        bModule
    },
    // 数据状态
    state: {
        userInfo: {
            name: 'admin',
            age: 10000
        },
        isAdmin: true,
    },
    // 帮助我们从状态中取值（）
    getters: {
        userInfoStr: (state) => {
            const userInfo = state.userInfo
            return `${userInfo.name} - ${userInfo.age}`
        }
    },

    // 改变
    mutations: {
        // mutation 的操作一定是一个同步方法
        setUserInfo(state, payload) {
            // ....
            state.userInfo = payload
        },
        setIsAdmin(state, payload = false) {
            state.isAdmin = payload
        }
    },
    actions: {
        // action 可以是一个 异步方法（可以在 action 方法中进行数据请求，）
        setUserInfoAction(context, payload) {
            // state 状态数据
            // commit 函数 ---> 调用 mutation 方法
            // dispatch 函数 ---> 调用 actions 方法

            // 【不推荐】方式一：通过 state 修改一个或者多个状态值
            // 【推荐】方式二：通过 commit 函数调用一个或多个 mutation 函数，修改状态值
            // 【推荐】方式三：通过 dispatch 函数调用一个或者多个 action 函数，修改状态值

            console.log("context", context)
            console.log("payload", payload)

            if (payload.name !== 'admin') {
                context.commit('setIsAdmin')
            }

            context.commit('setUserInfo', payload)
        }
    },
}

export default new Vuex.Store(store)

